import { useEffect, useState } from 'react';
import { get } from '../services/api';
import StudentGradeTable from '../components/StudentGradeTable';

function StudentGradesPage() {
    const [studentId, setStudentId] = useState('');
    const [grades, setGrades] = useState([]);

    const handleSearch = async () => {
    const response = await get(`/api/grades/students/${studentId}`);
    setGrades(response.data);
};

return (
    <div>
    <h1>Student Grades</h1>
    <input
        type="number"
        placeholder="Student ID"
        value={studentId}
        onChange={(e) => setStudentId(e.target.value)}
    />
    <button onClick={handleSearch}>Search</button>
    <StudentGradeTable grades={grades} />
    </div>
);
}

export default StudentGradesPage;